iT邦幫忙

2022 iThome 鐵人賽

DAY 10
0
自我挑戰組

30天的網頁學習系列 第 10

Day10 | 外掛工具VS Color Picker

  • 分享至 

  • xImage
  •  

今天要來做第四張網美照,用到的技術就是加入長方形和移動位置,就不特別寫筆記。/images/emoticon/emoticon37.gif
第一天文章有提到Visual studio code是可以安裝其他擴充配件,告訴大家一個蠻實用的附加工具,在設計畫面的時候,常常為了圖片的和諧,我們會將色系盡量一致或是從照片中吸色來做顏色上的搭配,這邊要介紹的工具就是VS Color Picker!!!!

外掛工具

VS Color Picker

詳細介紹大家可以上VS Color Picker查看,簡單一句就是調色和吸色。
調色功能是VScode原本就可以做到,使用起來也是非常方便,甚至可以直接調整透透明程度,所以VS Color Picker不一樣的地方是它可以吸顏色,這樣在不知道HEX碼或是RGB的情況下也可以輕鬆拿到顏色。
https://ithelp.ithome.com.tw/upload/images/20220923/201520100p4daaWU3r.png
這邊示範一次給大家看(雖然簡介就有範例...
打出 # 點選滴管,移動到目標顏色,待HEX碼出來後按enter就吸好顏色了。
(不過跳出來的選單每次都出現在不同位置)
圖片

成果展示

https://ithelp.ithome.com.tw/upload/images/20220923/20152010lM3t7kg35m.png

參考資料

VS Color Picker


上一篇
Day09 | CSS之border&writing-mode
下一篇
Day11 | CSS之水平與垂直置中
系列文
30天的網頁學習30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言